<template>
<!-- 自动提现配置 -->
<el-dialog title="自动提现配置" :visible.sync="dialogVisible" :close-on-click-modal="closeModal" :close-on-press-escape="closeEscape" :before-close="close" class="dialog-container" width="800px">
  <div class="config-form-wrapper"> 
    <el-form :model="configForm" ref="configForm" label-width="20px" :rules="configRules">
      <el-form-item label="" prop="autoWithdraw">
        <el-radio-group v-model="configForm.autoWithdraw">
          <el-radio :label="true">开启每天自动提现</el-radio>
          <el-radio :label="false">关闭每天自动提现</el-radio>
        </el-radio-group>
        <div>提示：关闭每天自动提现后，您可以通过手动操作提现把账户内结算资金提到您的绑定的银行卡内。</div>
      </el-form-item>
      <el-form-item label="" prop="withdrawTime">
        <el-radio-group v-model="configForm.withdrawTime" :disabled="!configForm.autoWithdraw" class="time-group">
          <el-radio v-for="(item,index) in timeOptions" :key="index" :label="item">{{item}}</el-radio>
        </el-radio-group>
      </el-form-item>
    </el-form>
  </div>
  <div slot="footer" class="dialog-footer">
    <el-button size="mini" @click="close">取 消</el-button>
    <el-button size="mini" type="primary" :loading="submitLoading" @click="confirmSign">保 存</el-button>
  </div>
</el-dialog>
</template>

<script>
import dialog from '@mix/dialog'
import { updateWithdrawTypeApi,getAutoWithdrawTimeApi } from '@/api/finance'
export default {
  mixins: [dialog],
  props: {
    info: {
      type: Object,
      default: () => ( {} )
    }
  },
  data() {
    return {
      configForm: {
        autoWithdraw: false,
        withdrawTime: '00:00',
        accountCode:''
      },
      submitLoading: false,
      configRules:{
        autoWithdraw:[
          {required: true, message: '请选择提现方式', trigger: 'blur'}
        ],
        withdrawTime:[
          {required: true, message: '请选择提现时间', trigger: 'change'}
        ]
      },
      timeOptions: ['00:00','07:00','07:30','08:00','09:00','09:30']    //4种账户交集
    }
  },
  created() {
    // 获取商户ID（vuex或者sessionStorage）
    this.initPage()
  },
  methods: {
    initPage(){
      this.configForm = this.info
      this.getAutoWithdrawTime(this.info.accountCode)
    },
    //修改提现方式
    async confirmSign() {
      this.$refs['configForm'].validate(async valid=>{
        if(valid){
          this.submitLoading = true
          const {code} = await updateWithdrawTypeApi(this.configForm)
          if(code === 200){
            this.$message.success('设置成功');
            this.close()
            this.submitLoading = false
          }else{
            this.submitLoading = false
          }
        }
      })
    },
    // 获取账户提现时间
    async getAutoWithdrawTime(accountCode){
      try{
        const {code, result = []} = await getAutoWithdrawTimeApi({accountCode})
        if(code!==200) return
        this.timeOptions = result
      }catch(e){
        console.log(e)
      }
    }
  }
}
</script>

<style lang="less" scoped>
.config-form-wrapper {
  /deep/.el-radio-group {
    font-size: 0;
    line-height: 25px;

    .el-radio {
      margin-right: 60px;
      width: 121px;
      margin-bottom: 8px;
    }
  }
  .time-group{
    display: flex;
    flex-wrap: wrap;
  }
}
</style>
